<template>
	<view class="ym">
		<cu-custom bgColor="bg-gradual-pink" :isBack="true"><block slot="backText">返回</block>
			<block slot="content">客户详情</block>
		</cu-custom>

		<view class="mc">
			<view class="mcc">
				<view class="mccc">
					{{detail.name}}
				</view>
			</view>
			<view class="sz">
				<view class="ssz">
					{{detail.name}} {{detail.phone}}
				</view>
				<view class="szz">
					{{detail.birth}} {{age}}岁
				</view>
			</view>
			<view class="zfx">
				<view class="zfxx">
					{{detail.label}}
				</view>
			</view>
			<view class="gglwx">
				<view class="glwx">
					<view class="glwxx">
						关联微信
					</view>
				</view>
			</view>
		</view>
		<view class="hui">
			<view class="yj">
				预计生理期10月31日
			</view>
			<view class="sx">
				{{detail.label}}
			</view>
			<view class="gs">
				{{detail.mark}}
			</view>
		</view>
		<view class="beiz">
			<view class="beizz">
				备注：{{detail.label}}
			</view>
			<image class="tp" src="../../../static/33.png" mode=""></image>
		</view>
		<view class="khdt">
			<view class="dt">
				客户动态
			</view>
			<view class="gj">
				跟进记录
			</view>
		</view>
		<view class="dit">
			<image class="ditt" src="../../../static/11.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				detail:{},
				id:'',
				openid:'',
				age:'0',
			}
		},
		onLoad(e) {
			this.id = e.id
			let that = this;
			uni.getStorage({
				key: 'openid',
				success: (res) => {
					that.openid = res.data
					that.setajax()
			 },
			 fail: () => {
			 }
			});
		},
		methods: {
			setajax(){
				var data = {
					'openid': this.openid,
					'id': this.id
				}
				console.log(data)
				uni.request({
					url: 'https://wechatdemo.mygodmall.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=member.biaodan_detail&app=1',
					method: 'POST',
					data: data,
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						console.log(res)
						this.detail = res.data.detail
						let age1 = res.data.detail.birth.substr(0,4)
						let myDate = new Date();
						let tYear = myDate.getFullYear();
						console.log(tYear)
						this.age = tYear - Number(age1)
						console.log(this.age)
					},
					fail: () => {},
					complete: () => {}
				});
			},
		}
	}
</script>

<style>
.ym{
	background: #fff;
}
.toub{
	height: 50upx;
	background: #000000;
}
.toubb{
	height: 110upx;
	display: flex;
	align-items: center;
}
.tb{
	width: 50upx;
	height: 50upx;
}
.zt{
	font-size: 40upx;
	color: #ffffff;
}
.mc{
	height: 150upx;
	background: #000000;
	display: flex;
	align-items: center;
}
.mcc{
	background: #1CBBB4;
	width: 100upx;
	height: 100upx;
	border: solid #1CBBB4;
  border-top-left-radius: 50upx;
  border-top-right-radius: 50upx;
  border-bottom-right-radius: 50upx;
  border-bottom-left-radius: 50upx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 10upx;
}
.mccc{
	font-size: 30upx;
	color: #ffffff;
}
.sz{
	margin: 5upx;
	color: #ffffff;
}
.ssz{
	font-size: 35upx;
}
.zfx{
	background: #686e7a;
	width: 100upx;
	height: 50upx;
	border: solid #686e7a;
	border-top-left-radius: 10upx;
	border-top-right-radius: 10upx;
	border-bottom-right-radius: 10upx;
	border-bottom-left-radius: 10upx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 10upx;
}
.zfxx{
	font-size: 30upx;
	color: #ffffff;
}
.gglwx{
	display: flex;
	flex-direction: row;
}
.glwx{
	background: #1CBBB4;
	width: 150upx;
	height: 50upx;
	border: solid #1CBBB4;
	border-top-left-radius: 25upx;
	border-top-right-radius: 25upx;
	border-bottom-right-radius: 25upx;
	border-bottom-left-radius: 25upx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 50upx;
	margin-top: 30upx;
}
.glwxx{
	font-size: 25upx;
	color: #ffffff;
}
.hui{
	height: 70upx;
	display: flex;
	align-items: center;
}
.yj{
	color: #ffffff;
	background: #686e7a;
	width: 320upx;
	height: 50upx;
	border: solid #686e7a;
	border-top-left-radius: 25upx;
	border-top-right-radius: 25upx;
	border-bottom-right-radius: 25upx;
	border-bottom-left-radius: 25upx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 10upx;
}
.sx{
	color: #ffffff;
	background: #686e7a;
	width: 100upx;
	height: 50upx;
	border: solid #686e7a;
	border-top-left-radius: 25upx;
	border-top-right-radius: 25upx;
	border-bottom-right-radius: 25upx;
	border-bottom-left-radius: 25upx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 10upx;
}
.gs{
	color: #ffffff;
	background: #686e7a;
	width: 150upx;
	height: 50upx;
	border: solid #686e7a;
	border-top-left-radius: 25upx;
	border-top-right-radius: 25upx;
	border-bottom-right-radius: 25upx;
	border-bottom-left-radius: 25upx;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 10upx;
}
.beiz{
	height: 80upx;
	display: flex;
	align-items: center;
	margin: 20upx;
}
.beizz{
	color:#999da9;
}
.tp{
	margin-left: 480upx;
	width: 50upx;
	height: 50upx;
}
.khdt{
	height: 110upx;
	background: #ffffff;
	display: flex;
	align-items: center;
}
.dt{
	font-size: 40upx;
	color: #000000;
	margin: 20upx;
}
.gj{
	font-size: 40upx;
	color:#999da9;
	margin: 20upx;
}
.dit{
	height: 1000upx;
}
.ditt{
	width: 100%;
	height: 100%;
}
</style>
